<template>
  <div>
    <div class="login" @click="register">
      <div class="log_img">
        <i class="icon-icon-test"></i>
        <img src alt v-if="false">
      </div>
      <div class="log_menu">登录/注册</div>
    </div>
    <ul>
      <li v-for="(val,ind) in leftMenu" :key="ind">
        <a @click="toIndex(val.path)">
          <i :class="val.icon"></i>
          {{val.menu}}
        </a>
      </li>
    </ul>
  </div>
</template>
<script>
import { mapState, mapActions } from "vuex";

export default {
  data() {
    return {
      class: ""
    };
  },
  computed: {
    ...mapState(["leftMenu"])
  },
  methods: {
    register() {
      this.$parent.bln2 = !this.$parent.bln2;
    },
    toIndex(url) {
      this.$parent.bln = false;
      this.$router.push(url);
      this.$parent.title = "POCO摄影";
      this.$parent.right = "";
    }
  }
};
</script>
<style scoped>
.login {
  width: 100%;
  padding: 0.5rem;
  display: flex;
  color: #fff;
  justify-content: flex-start;
}
.login i {
  font-size: 0.6rem;
  line-height: 1.2rem;
  padding-left: 0.3rem;
}
.login div {
  height: 1.2rem;
  display: inline-block;
}
.login .log_img {
  height: 1.2rem;
  width: 1.2rem;
  border-radius: 0.6rem;
  background: #666;
  flex-shrink: 1;
}
.login .log_menu {
  padding-left: 0.3rem;
  line-height: 1.2rem;
}
.leftMenu ul li {
  padding: 0 0.6rem;
  height: 0.9rem;
  font-size: 0.3rem;
  line-height: 0.9rem;
}
.leftMenu ul li i {
  padding-right: 0.3rem;
}
.leftMenu ul li a {
  color: #fff;
  display: block;
  text-decoration: none;
}
</style>
